<template>
    <div>
        <p ref="sch">{{ name }}</p>
        <button @click="printSch">通过ref获取dom元素</button>
        <p>{{ address }}</p>
        <Student ref="stu"></Student>
        <button @click="printStu">通过ref获取VueComponent组件</button>
    </div>
</template>

<script>
import Student from "./Student.vue";

export default {
    name: "School",
    components: {
        Student,
    },
    data() {
        return {
            name: "希望小学",
            address: "红buff上草",
        };
    },
    methods: {
        printSch() {
            console.log(this.$refs.sch);
        },
        printStu() {
            console.log(this.$refs.stu);
        },
    },
};
</script>

<style></style>
